<template>
    <div>
        <van-cell is-link :title="alldata.condition + alldata.stitle" @click="setvalue(index, alldata)" />
        <van-action-sheet v-model="show" :actions="actions" @select="onSelect" />
        <van-circle style="margin-left:30vw" size="130px" v-model.number="alldata.completedata[2][3]" :rate="alldata.completedata[2][1]" :clockwise="false" layer-color="rgb(245, 245, 245)">
            <template #default>
                <span style="color:rgb(110, 110, 110)" v-html="'<br><br>' + alldata.completedata[2][0] + '<br>'"></span>
                <span style="font-size:20px" v-html="alldata.completedata[2][1] + '%'"></span>
            </template>
        </van-circle>
        <van-row style="margin-top:7px" @click="showComplete(alldata)">
            <van-col v-for="(coldata, index) in alldata.completedata" v-show="index !== 2" :key="index" class="itemcol" span="12">
                <span style="font-size:12px">{{ coldata[0] }}</span><br>
                <span style="color:green;font-size:20px">{{ coldata[1] }}</span>
                <span style="color:green;font-size:12px">{{ coldata[2] }}</span>
            </van-col>
        </van-row>
        <van-button type="default" block @click="showComplete(alldata)">查看明细</van-button>
    </div>
</template>
<script>
import Vue from 'vue'
import qs from 'qs'
import { TreeSelect, Grid, GridItem, Toast, Popup, Tabbar, TabbarItem, Swipe, SwipeItem, Col, Row, DropdownMenu, DropdownItem, NoticeBar, ActionSheet, Cell, CellGroup, Circle, Button, Tab, Tabs, Icon, Sticky, DatetimePicker } from 'vant'
import commonTitleMixin from '../mixins/commonTitleMixin'
Vue.use(Icon).use(Sticky).use(DatetimePicker).use(TreeSelect).use(Grid).use(GridItem).use(Toast).use(Popup).use(Tabbar).use(TabbarItem).use(Swipe).use(SwipeItem).use(Col).use(Row).use(DropdownMenu).use(DropdownItem).use(NoticeBar).use(ActionSheet).use(Cell).use(CellGroup).use(Circle).use(Button).use(Tabs).use(Tab)
export default {
    name: 'diamond',
    data: function () {
        return {
            show: false,
            tempindex: 0,
            itemid: '',
            itemname: '',
            actions: [
                { name: '本年', value: 'myyear' },
                { name: '上年', value: 'mypreyear' },
                { name: '本季度', value: 'myquarter' },
                { name: '上季度', value: 'myprequarter' },
                { name: '本月', value: 'mymonth' },
                { name: '上月', value: 'mypremonth' },
                { name: '本周', value: 'myweek' },
                { name: '上周', value: 'mypreweek' },
                { name: '本日', value: 'myday' },
                { name: '上日', value: 'mypreday' }
            ]
        }
    },
    props: ['alldata', 'index'],
    mixins: [commonTitleMixin],
    mounted () {
        // //console.log('complete', this.alldata)
    },
    methods: {
        onSelect (item) {
            this.show = false
            this.showtitle = item.name
            this.getdata(item.value, item.name)
        },
        showComplete (item) {
            this.$router.push({ name: 'showcomplete', query: { item: this.alldata, currentdep: this.depvalue } })
        },
        setvalue (index, item) {
            this.show = true
            this.tempindex = index
            this.itemid = item.itemid
            this.itemname = item.sname
        },
        getdata (value, name) {
            let data = { itemid: this.itemid, condition: value, currentdep: this.depvalue }
            //console.log(data)
            let url = '/api/extractdata.getdata.do'
            if (this.itemname === 'complete') {
                url = '/api/completedata.getcompletedata.do'
            } else if (this.itemname === 'twobarandline') {
                url = '/api/homepage.gettwobarandline.do'
            } else if (this.itemname === 'provinceproduct') {
                url = '/api/homepage.getprovinceproduct.do'
            }
            this.axios({
                method: 'post',
                url: url,
                data: qs.stringify(data)
            }).then(res => {
                let alldata = this.alldata
                //console.log('alldata' + alldata)
                //console.log('alldata[0]' + alldata[0])
                //console.log('alldata[1]' + alldata[1])
                for (let i = 0; i < alldata.length; i++) {
                    if (alldata[i].itemid === this.itemid) {
                        if (this.itemname === 'complete') {
                            this.alldata[i].completedata = res.data
                        } else if (this.itemname === 'twobarandline') {
                            this.alldata[i].xja = res.data.xja
                            this.alldata[i].bararr1 = res.data.bararr1
                            this.alldata[i].bararr2 = res.data.bararr2
                            this.alldata[i].line = res.data.line
                            this.alldata[i].title = res.data.title
                        } else if (this.itemname === 'provinceproduct') {
                            //console.log(this.adddata)
                            this.alldata[i].xja2 = res.data.xja2
                            this.alldata[i].xja1 = res.data.xja1
                            this.alldata[i].bararr1 = res.data.bararr1
                            this.alldata[i].bararr2 = res.data.bararr2
                            this.alldata[i].line = res.data.line
                            this.alldata[i].title = res.data.title
                        } else {
                            this.alldata[i].arrdata = res.data
                        }
                        this.alldata[i].condition = name
                    }
                }
            }).catch(res => {
                this.reserror(res)
            })
        }
    }
}
</script>
